import { useRequest } from "ahooks";
import { useForm } from "rc-field-form";
import { useState } from "react";
import { fetchDictionariesItem } from '@/service/common'
import { IDictionaries } from "@/service/type";
import { IProps } from ".";
export interface IFormdata {
  minAge: number;
  maxAge: number;
  minHeight: number;
  maxHeight: number;
  minWeight: number;
  maxWeight: number;
  /**婚姻状况 */
  marriageHistory: string;
  /**星座 */
  constellation: string;
  /**生肖 */
  chineseZodiac: string;
  /** 性别 */
  gender: '1' | '2';
  /** 籍贯 */
  nativePlace: string;
  /** 居住地 */
  residence: string
}

type KeyType = keyof IFormdata;
type ValueType = IFormdata[keyof IFormdata];

function useData({ showTabs, onSearch }: IProps) {
  const [form] = useForm<IFormdata>();
  const [isShowPopup, setIsShowPopup] = useState(false);

  const { data: marriageHistoryData } = useRequest(() => fetchDictionariesItem(IDictionaries.marriageHistory), {
    formatResult: e => e.res
  })
  const { data: constellationData } = useRequest(() => fetchDictionariesItem(IDictionaries.constellation), {
    formatResult: e => e.res
  })
  const { data: chineseZodiacData } = useRequest(() => fetchDictionariesItem(IDictionaries.chineseZodiac), {
    formatResult: e => e.res
  })

  const onRemoveSearch = (name) => {
    form.resetFields([name])
    const params = form.getFieldsValue()
    console.log(params)
    onSearch(params)
    // const params = form.getFieldsValue();
    // form.setFieldsValue({
    //   ...params,
    //   [name]: undefined,
    //   [name + 'Cn']: undefined
    // });
  }

  /** 选择个人标签 */
  const onSelectedLabel = (name, value, label?: string) => {
    const params = form.getFieldsValue();
    form.setFieldsValue({
      ...params,
      [name]: value,
      [name + 'Cn']: label
    });
  };

  /** 搜索 */
  const onHandleSearch = () => {
    const params = form.getFieldsValue()
    onSearch(params)
  }

  const onResetSearch = () => {
    form.resetFields()
    const params = form.getFieldsValue()
    onSearch(params)
  }

  return {
    form,
    isShowPopup,
    marriageHistoryData,
    constellationData,
    chineseZodiacData,
    setIsShowPopup,
    onHandleSearch,
    onSelectedLabel,
    onRemoveSearch,
    onResetSearch
  }
}

export default useData